<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="../css/reset.css" />
		<link rel="stylesheet" href="../css/center2.css" />
		<style>
			
		</style>
	</head>
	<body>
		<div id="allmap"></div>
		<div class="top">
			<div>
				<p>网络节点</p>
				<h3>22个</h3>
			</div>
			<div>
				<p>路面管井</p>
				<h3>22个</h3>
			</div>
			<div>
				<p>路面监控</p>
				<h3>22个</h3>
			</div>
			<div>
				<p>在维建筑</p>
				<h3>6个</h3>
			</div>
		</div>
		<div class="right">
			<div class="r-top">
				<h3>巡检情况</h3>
				<table>
					<thead>
						<tr>
							<th>巡检位置</th>
							<th>状态</th>
							<th>巡检人</th>
							<th>巡检时间</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>网络机房</td>
							<td class="orange">未巡检</td>
							<td>张三</td>
							<td>2019.4.23 12:00</td>
						</tr>
						<tr>
							<td>节点1</td>
							<td>已巡检</td>
							<td>张三</td>
							<td>2019.4.23 12:00</td>
						</tr>
						<tr>
							<td>节点2</td>
							<td>已巡检</td>
							<td>张三</td>
							<td>2019.4.23 12:00</td>
						</tr>
					</tbody>
				</table>
			</div>
			<div class="r-bottom">
				<h3>维修情况</h3>
				<table>
					<thead>
						<tr>
							<th>设备名称</th>
							<th>位置</th>
							<th>状态</th>
							<th>维修时间</th>
						</tr>
					</thead>
				</table>
				<div class="list">
					<table>
						<tbody>
							<tr>
								<td>服务器</td>
								<td>网络机房</td>
								<td class="orange">维修中</td>
								<td>2019.4.23</td>
							</tr>
							<tr>
								<td>交换机</td>
								<td>节点1</td>
								<td class="yellow">已带走</td>
								<td>2019.4.23</td>
							</tr>
							<tr>
								<td>交换机</td>
								<td>节点2</td>
								<td class="blue">已带回</td>
								<td>2019.4.23</td>
							</tr>
						</tbody>
					</table>
				</div>
				
			</div>
		</div>
		<script src="../js/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=c6z10TxX9lNzVzPXz8BqTXPUmgES16KI"></script>
		<script>
			var map = new BMap.Map('allmap');
			var point = new BMap.Point(116.404,39.915);
			map.centerAndZoom(point,14);
			map.setMapStyle({style:'midnight'})
		</script>
	</body>
</html>
